<style>
body{
	background: url('/img/bg.jpg') no-repeat
}
</style>
<div class="row">
	<div class="fourcol"></div>
	<div class="fourcol">
		<div class="box red first rounded">
			<div class="outer_wrapper">
				<div class="wrapper">
					<img style="display: block; width: 100%; margin: 0 auto" src="img/logo.png" alt="Efteling" />
			    </div><!-- wrapper -->
		    </div><!-- outer_wrapper -->
		</div><!-- box -->
		<?php if(isset($validation->errors)):?>
		<div class="notice margin-top">
			<ul>
			<?php foreach($validation->errors as $error): ?>
				<li><?= $error ?></li>
			<?php endforeach; ?>
			</ul>
		</div>
		<?php endif; ?>
		<div id="login" class="box red margin-top rounded">
			<div class="outer_wrapper">
				<div class="wrapper">
					<div class="margin">
				        <h2>Inloggen</h2>
				        <form id="login_form" name="login" action="<?php echo $_SERVER['PHP_SELF']?>" method="post">
							<label for="chip_id" class="margin-bottom">Gadgetnummer</label>
							<input id="chip_id" name="chip_id" type="number" value="<?php echo(isset($_POST['chip_id']) ? $_POST['chip_id'] : "")?>" />
							<button name="submit" type="submit" class="margin-top">Inloggen</button>
						</form>
					</div>
			    </div><!-- wrapper -->
		    </div><!-- outer_wrapper -->
		</div><!-- box -->
	</div>
	<div class="fourcol"></div>
</div>

<script>
$('#login').hide();
$(document).ready(function() {
	 $('#login').slideDown('slow');
	  // Handler for .ready() called.
	});
</script>